/**
 * 一、src目录下的index.js是整个项目中入口js
 * ReactDOM:React DOM 是 React 用于操作浏览器 DOM 的库
 * React的操作的基本步骤
 * 1、导入ReactDOM:从react-dom/client依赖包中默认导入ReactDOM
 * 2. 通过ReactDOM这个类中的静态方法createRoot创建root对象
 *    createRoot的参数是一个DOM容器，用来将虚拟DOM渲染到哪个DOM容器中
 * 3、调用ReactDOM.Root对象中的render方法用来渲染虚拟DOM到页面上
 * 二、React中如何创建虚拟DOM
 * React中创建虚拟DOM有两种方式
 * 1)、React.createElement()方法来创建虚拟DOM（不常用）
 * 2)、JSX的方式创建虚拟DOM（最常用）
 */
import ReactDOM from 'react-dom/client'
import React from 'react'
import './index.css'
const root=ReactDOM.createRoot(document.getElementById('root'))
//通过React.createElement的方式创建h1元素
const liElement1=React.createElement('li',{key:1},'苹果')
const liElement2=React.createElement('li',{key:2},'橘子')
/**
 * 为了避免和class类的关键字冲突，在class样式这个属性上使用className来代替
 */
const ulElement=React.createElement('ul',{className:'box'},[liElement1,liElement2])
root.render(ulElement)
